<template>
  <div>
    <a-form ref="elForm" :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }">
      <a-form-item label="证书编号" required>
        <a-input
          v-model="formData.certificate_no"
          placeholder="请输入证书编号"
          :style="{ width: '100%' }"
        ></a-input>
      </a-form-item>
      <a-form-item label="申请商公司" required>
        <a-input
          v-model="formData.applycompany_name"
          placeholder="请输入申请商公司"
          :style="{ width: '100%' }"
        ></a-input>
      </a-form-item>
      <a-form-item label="申请商地址" required>
        <a-textarea
          v-model="formData.applyaddress"
          placeholder="请输入申请商地址"
          :auto-size="{ minRows: 3, maxRows: 5 }"
        ></a-textarea>
      </a-form-item>
      <a-form-item label="制造商公司" required>
        <a-input
          v-model="formData.makecompany_name"
          placeholder="请输入制造商公司"
          :style="{ width: '100%' }"
        ></a-input>
      </a-form-item>
      <a-form-item label="制造商地址" required>
        <a-textarea
          v-model="formData.makeaddress"
          placeholder="请输入制造商地址"
          :auto-size="{ minRows: 3, maxRows: 5 }"
        ></a-textarea>
      </a-form-item>
      <a-form-item label="产品名称" required>
        <a-input
          v-model="formData.product_name"
          placeholder="请输入产品名称"
          :style="{ width: '100%' }"
        ></a-input>
      </a-form-item>
      <a-form-item label="产品型号" required>
        <a-input
          v-model="formData.product_no"
          placeholder="请输入产品型号"
          :style="{ width: '100%' }"
        ></a-input>
      </a-form-item>
      <a-form-item label="商标" required>
        <a-textarea
          v-model="formData.trademark"
          placeholder="请输入测试标准"
          :auto-size="{ minRows: 3, maxRows: 5 }"
        ></a-textarea>
      </a-form-item>
      <a-form-item label="商标:" required>
        <upManyImgComp
          :fileListArr="avatar"
          @gainList="uploadpicturePath"
          :limit="1"
        ></upManyImgComp>
      </a-form-item>
      <a-form-item label="测试标准" required>
        <a-textarea
          v-model="formData.test_standard"
          placeholder="请输入测试标准"
          :auto-size="{ minRows: 3, maxRows: 5 }"
        ></a-textarea>
      </a-form-item>
      <a-form-item label="发证时间" required>
        <a-date-picker
          v-model="formData.publish_time"
          placeholder="请输入发证时间"
        ></a-date-picker>
      </a-form-item>
      <el-row class="filterbottom">
        <div class="operation">
          <el-button @click="close()">关闭</el-button>
          <el-button type="primary" @click="submitForm()">确定</el-button>
        </div>
      </el-row>
    </a-form>
  </div>
</template>
<script>
import { apiComm } from '@/api/index'
import moment from 'moment'
import upManyImgComp from '@/components/upManyImgComp'
export default {
  props: ['fid'],
  data() {
    return {
      formData: {
        fid: undefined,
        certificate_no: undefined,
        applycompany_name: undefined,
        applyaddress: undefined,
        makecompany_name: undefined,
        makeaddress: undefined,
        product_name: undefined,
        product_no: undefined,
        trademark: undefined,
        test_standard: undefined,
        publish_time: undefined
      },
      avatar: []
    }
  },
  components: { upManyImgComp },
  methods: {
    submitForm() {
      if (
        this.formData.certificate_no === undefined &&
        this.formData.certificate_no === ''
      ) {
        this.$message.success('请输入证书编号!')
        return
      }
      if (
        this.formData.applycompany_name === undefined &&
        this.formData.applycompany_name === ''
      ) {
        this.$message.success('请输入申请商公司!')
        return
      }
      if (
        this.formData.makecompany_name === undefined &&
        this.formData.makecompany_name === ''
      ) {
        this.$message.success('请输入制造商公司!')
        return
      }
      if (
        this.formData.product_name === undefined &&
        this.formData.product_name === ''
      ) {
        this.$message.success('请输入产品名称!')
        return
      }
      if (
        this.formData.product_no === undefined &&
        this.formData.product_no === ''
      ) {
        this.$message.success('请输入产品型号!')
        return
      }
      if (
        this.formData.test_standard === undefined &&
        this.formData.test_standard === ''
      ) {
        this.$message.success('请输入测试标准!')
        return
      }
      if (this.avatar.length === 0) {
        this.formData.trademark = ''
      } else {
        this.formData.trademark = this.avatar[0].url
      }
      if (
        this.formData.publish_time === undefined &&
        this.formData.publish_time === ''
      ) {
        this.$message.success('请输入发证时间!')
        return
      }
      this.formData.publish_time = moment(this.formData.publish_time).format(
        'YYYY-MM-DD HH:mm:ss'
      )
      if (this.formData.fid === undefined) {
        apiComm('dictionary.addcertificate', this.formData).then(res => {
          this.$emit('savedata', res)
        })
      } else {
        apiComm('dictionary.editcertificate', this.formData).then(res => {
          this.$emit('savedata', res)
        })
      }
    },
    uploadpicturePath(filelist) {
      this.avatar = filelist
    },
    close() {
      this.$emit('close')
    }
  },
  mounted() {
    if (this.fid !== undefined && this.fid !== null) {
      apiComm('dictionary.getCertificateById', { fid: this.fid }).then(res => {
        if (res.code === 0) {
          this.formData.fid = res.data.fid
          this.formData.certificate_no = res.data.certificate_no
          this.formData.applycompany_name = res.data.applycompany_name
          this.formData.applyaddress = res.data.applyaddress
          this.formData.makecompany_name = res.data.makecompany_name
          this.formData.makeaddress = res.data.makeaddress
          this.formData.product_no = res.data.product_no
          this.formData.product_name = res.data.product_name
          this.formData.test_standard = res.data.test_standard
          this.formData.publish_time = res.data.publish_time
          this.formData.trademark = res.data.trademark
          this.avatar.push({
            uid: res.data.fid,
            name: 'image.png',
            status: 'done',
            url: res.data.trademark
          })
        }
      })
    } else {
      this.formData = {
        fid: undefined,
        certificate_no: undefined,
        applycompany_name: undefined,
        applyaddress: undefined,
        makecompany_name: undefined,
        makeaddress: undefined,
        product_name: undefined,
        product_no: undefined,
        trademark: undefined,
        test_standard: undefined,
        publish_time: undefined
      }
    }
  }
}
</script>
<style scoped>
.filterbottom {
  margin-top: 8px;
  margin-left: 15px;
  margin-right: 10px;
}
.filterbottom button {
  float: right;
  margin-right: 10px;
  margin-bottom: 20px;
}
</style>
